<template>
    <div>
    <el-dialog
            title="请输入老人信息"
            :visible.sync="checkin_dialog_visible"
            width="30%"
            style="min-width: 600px"
    >
            <span>
                <el-divider></el-divider>
                <el-form ref="checkin_input_form"
                         :model="checkin_input_form"
                         label-width="120px"
                         size="mini"
                         :rules="checkin_dialog_rules">
                    <el-form-item label="客户姓名:" prop="name">
                        <el-input v-model="checkin_input_form.name" placeholder="请输入【客户姓名】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="年龄:" prop="age">
                        <el-input v-model="checkin_input_form.age" placeholder="请输入【年龄】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="性别:" prop="gender">
                         <el-select v-model="checkin_input_form.gender" value="男">
                             <el-option label="男" value="男" ></el-option>
                             <el-option label="女" value="女"></el-option>
                         </el-select>
                    </el-form-item>
                    <el-form-item label="身高/cm:" prop="height">
                        <el-input v-model="checkin_input_form.height" placeholder="请输入【身高】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="体重/kg:" prop="weight">
                        <el-input v-model="checkin_input_form.weight" placeholder="请输入【体重】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="血型:" prop="blood_type">
                        <el-input v-model="checkin_input_form.blood_type" placeholder="请输入【血型】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="婚姻状况:" prop="marital_status">
                        <el-input v-model="checkin_input_form.marital_status" placeholder="请输入【婚姻状况】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="护理等级:" prop="nursing_level">
                        <el-select v-model="checkin_input_form.nursing_level">
                             <el-option label="1" value="1" ></el-option>
                             <el-option label="2" value="2"></el-option>
                            <el-option label="3" value="3"></el-option>
                            <el-option label="4" value="4"></el-option>
                         </el-select>
                    </el-form-item>
                    <el-form-item label="身份证号:" prop="identify_number">
                        <el-input v-model="checkin_input_form.identify_number" placeholder="请输入【身份证号】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="房间号:" prop="room_number">
                        <el-input v-model="checkin_input_form.room_number" placeholder="请输入【房间号】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="床位号:" prop="bed_number">
                        <el-input v-model="checkin_input_form.bed_number" placeholder="请输入【床位号】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="所属楼房:" prop="building_number">
                        <el-input v-model="checkin_input_form.building_number" placeholder="请输入【所属楼房】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="老人类型:" prop="type">
                         <el-select v-model="checkin_input_form.type" value="1">
                             <el-option label="活力老人" value="1" ></el-option>
                             <el-option label="自理老人" value="2"></el-option>
                             <el-option label="护理老人" value="3"></el-option>
                         </el-select>
                    </el-form-item>
                    <el-form-item label="入住时间" prop="checkin_time">
                        <el-date-picker type="date" placeholder="选择日期" v-model="checkin_input_form.checkin_time"
                                        style="width: 100%;">
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item label="合同到期时间" prop="contract_expiry_time">
                        <el-date-picker type="date" placeholder="选择日期" v-model="checkin_input_form.contract_expiry_time"
                                        style="width: 100%;">
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item label="联系电话:" prop="tel">
                        <el-input v-model="checkin_input_form.tel" placeholder="请输入【联系电话】信息"></el-input>
                    </el-form-item>
                    <el-form-item label="备注:" prop="remark">
                        <el-input v-model="checkin_input_form.remark"></el-input>
                    </el-form-item>
                        <el-button type="warning" @click="form_reset('checkin_input_form')" >清空</el-button>
                </el-form>
                <el-divider></el-divider>
            </span>
        <span slot="footer" class="dialog-footer">
            <el-button @click="handleCheckinDialogCancel()">取 消</el-button>
            <el-button type="primary" @click="handleCheckinDialogSubmit('checkin_input_form')">确 定</el-button>
        </span>
    </el-dialog>
    </div>
</template>

<script>
    import qs from 'qs'
    import axios from "axios";
    export default {
        name: "new_person_dialog",
        data(){
            return{
                checkin_dialog_rules:{
                    name:[{required: true, message: '请输入客户姓名', trigger: 'blur' }],
                    age:[{required: true, message: '请输入客户年龄', trigger: 'blur' }],
                    gender:[{required: true, message: '请输入客户性别', trigger: 'blur' }],
                    height:[{required: true, message: '请输入客户性别', trigger: 'blur' }],
                    weight:[{required: true, message: '请输入客户性别', trigger: 'blur' }],
                    blood_type:[{required: true, message: '请输入客户性别', trigger: 'blur' }],
                    marital_status:[{required: false, message: '请输入客户性别', trigger: 'blur' }],
                    nursing_level:[{required: false, message: '请输入客户性别', trigger: 'blur' }],
                    identify_number:[{required: true, message: '请输入客户身份证号', trigger: 'blur' }],
                    room_number:[{required: true, message: '请输入客户房间号', trigger: 'blur' }],
                    bed_number:[{required: true, message: '请输入客户床位号', trigger: 'blur' }],
                    building_number:[{required: true, message: '请输入客户楼栋号', trigger: 'blur' }],
                    type:[{required: true, message: '请输入客户类型', trigger: 'blur' }],
                    checkin_time:[{required: true, message: '请选择客户入住时间', trigger: 'blur' }],
                    contract_expiry_time:[{required: true, message: '请输入客户合同到期时间', trigger: 'blur' }],
                    tel:[{required: true, message: '请输入联系电话', trigger: 'blur' }],
                    remark:[{required: false}],
                },
                checkin_input_form:{
                    name:'',
                    age:'',
                    gender:'',
                    height:'',
                    weight:'',
                    blood_type:'',
                    marital_status:'',
                    nursing_level:'',
                    identify_number:'',
                    room_number:'',
                    bed_number:'',
                    building_number:'',
                    type:'',
                    checkin_time:'',
                    contract_expiry_time:'',
                    tel:'',
                    remark:'',
                },
                checkin_dialog_visible:false,
                use_format_check:true,
            }
        },
        methods:{
            handleCheckinDialogOpen(){
                this.$data.checkin_dialog_visible=true;

            },
            handleCheckinDialogCancel(){
                this.$message({
                    type:'info',
                    message:'已取消修改'
                });
                this.$data.checkin_dialog_visible=false;
            },
            handleCheckinDialogSubmit(formName){

                this.$refs[formName].validate((valid) => {
                    if (valid||!this.$data.use_format_check) {
                        this.$confirm('是否确认进行修改?', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(() => {
                            axios({
                                method:'post',
                                url:'/api/checkin_page/add_new_person',
                                data:qs.stringify(this.$data.checkin_input_form),
                            }).then(res=>{
                                if(res.data.rs===true) {
                                    this.$message({
                                        type: 'success',
                                        message: '添加成功!',
                                    });
                                    this.$data.checkin_dialog_visible = false;
                                }else{
                                    this.$message({
                                        type: 'error',
                                        message: '添加失败：'+res.data.errMsg,
                                    });
                                }
                            });
                        }).catch(() => {
                            this.$message({
                                type: 'info',
                                message: '已取消添加'
                            });
                        });
                    } else {
                        return false;
                    }
                });
            },
            form_reset(form_name){
                this.$refs[form_name].resetFields();
            }
        },


    }
</script>

<style scoped>

</style>